$(function(){
	vm.queryCommentList();
	vm.getCurrGoodsInfo();
	vm.getUser();
});



var vm = new Vue({
	el:'#vwrap',
	data:{
		commentList:[],
		comment:{},
		commentCount:0,
		currUser:{},
		goodsName:'',
		goods:{},
		paiZhuanStatus:'',
		b:false,
		page: 1,
		comment_page_record:0
	},
	methods: {
		queryCommentList: function (id) {
			console.log("comment_page_record1:"+this.comment_page_record);
			var url="/WX-PLATFORM/comment/all?gid="+vm.goods.id+"&page="+this.comment_page_record;
			
			layer.load('.comment');
			$.get(url,"",function(r){
				if(r){layer.closeAll('loading');}
				if(r==null||r==""){
					layer.msg("所有数据都在这，木有数据了",{time:1200});return;
				}
				
				++vm.comment_page_record;
				for ( var o in r) {
					var commDate=r[o].commentDatetime;
					var commMills=new Date(commDate).getTime();			//评论时间毫秒数
					var currMills=new Date().getTime();					//当前时间毫秒数
					var oneHourMills=60*60*1000;						//一小时毫秒数
					var oneMinMills=60*1000;							//一分钟毫秒数
					var millsCha=currMills-commMills;					//评论时间的毫秒数和当前时间毫秒数的差值
					var minuCha=Math.floor(millsCha/oneMinMills);		//差值-分钟
					var hourCha=Math.floor(millsCha/oneHourMills);		//差值-小时
					if(minuCha<=5){
						r[o].ctime="刚刚";
					}else if(minuCha<60&&minuCha>5){
						r[o].ctime=minuCha+"分钟前";
					}else if(hourCha<24&&hourCha>1){
						r[o].ctime=hourCha+"小时前";
					}else{
						var ctime=moment(commDate.substring(0,commDate.indexOf(" ")), "YYYY-MM-DD").fromNow(); //差值-天【包含一天】
						r[o].ctime=ctime;
					}
					
					
					
					
					
					if(r!=null&&r!=''){
						$('.commentList').append("<li v-for='comment in commentList' class='u-message' style='background: rgba(255,255,255,.8);'>"+
								"					<div class='user-img'>"+
								"						<c:if test='${empty curr_user.userPic}'><img width='50' height='50' src='http://img.mukewang.com/57035ff200014b8a06000338-228-128.jpg'/></c:if>"+
								"						<c:if test='${not empty curr_user.userPic}'><img width='50' height='50' :src='"+r[o].userImg+"'/></c:if>"+
								"						<!-- <img alt='' v-if='v.userPic.exist' :src='v.userPic.exist' width='50' height='50' style='border-radius:50%;'/>"+
								"						<img alt='' v-else  width='50' height='50' style='border-radius:50%;' :src='v.userPic.empty'/> -->"+
								"					</div>"+
								"					<div class='comment-body'>"+
								"						<p class='comm user-name' style='padding-top: 10px;'>"+r[o].userName+
								"							<span class='time-qian'>"+r[o].ctime+"</span>"+
								"							<span class='comm-zan'>"+
								"								<a v-if='comment.zhuanType=='1'' href='javascript:;' style='color:red;' class='c-paizhuan c-comm' @click='paiZhuan(comment.id,$index)'>" +
								"<svg class='icon chuizhicenter' aria-hidden='true'>"+
								"								  <use xlink:href='#icon-dislike__easy'></use>"+
								"								</svg>"+
								"拍一砖(<i class='paizhuan-count'>"+r[o].paizhuanCount+"</i>)</a>"+
								"								<a v-else='comment.zhuanType=='1'' href='javascript:;' class='c-paizhuan c-comm' @click='paiZhuan(comment.id,$index)'>" +
								"<svg class='icon chuizhicenter' aria-hidden='true'>"+
								"								  <use xlink:href='#icon-dislike__easy'></use>"+
								"								</svg>"+
								"拍一砖(<i class='paizhuan-count'>"+r[o].paizhuanCount+"</i>)</a>"+
								"								<a v-if='comment.zanType=='0''  href='javascript:;'  style='color:red;' class='c-zan c-comm' @click='dianZan(comment.id,$index)'>" +
								"<svg class='icon chuizhicenter' aria-hidden='true'>"+
								"								  <use xlink:href='#icon-like__easyico'></use>"+
								"								</svg>"+
								"赞(<i class='zan-count'>"+r[o].zanCount+"</i>)</a>"+
								"								<a v-else='comment.zanType=='0''  href='javascript:;' class='c-zan c-comm' @click='dianZan(comment.id,$index)'>" +
								"<svg class='icon chuizhicenter' aria-hidden='true'>"+
								"								  <use xlink:href='#icon-like__easyico'></use>"+
								"								</svg>"+
								"赞(<i class='zan-count'>"+r[o].zanCount+"</i>)</a>"+
								"								<a href='javascript:;' @click='huifuComment($index)' class='c-reply c-comm'>" +
								"<svg class='icon chuizhicenter' aria-hidden='true'>"+
								"									  <use xlink:href='#icon-pinglun2'></use>"+
								"									</svg>"+
								"回复(8)</a>"+
								"							</span>"+
								"						</p>"+
								"						<p class='comment-content'>"+r[o].commentContent+"</p>"+
								"						<p class='comm comment-date' style='margin:0 16px 0 0;color:#C5C5C5;'>"+
								"							<span><a class='pinglun-c' href='javascript:;' @click='huifulist($index)'><i class='iconfont icon-groupcopy5'>(11)</i></a></span>"+
								"							<span><a style='display:none;' class='shouqi' href='javascript:;' @click='shouqi($index)'>收起评论</a></span>"+
								"							<span>{{comment.commentDatetime}}</span>"+
								"						</p>"+
								"						<div style='clear: both;'></div>"+
								"						"+
								"						<!-- 回复 S -->"+
								"						<div class='c-huifu' style='display:none;'>"+
								"							<div class='huifu-cnt'>"+
								"								<textarea rows='10' cols='100' placeholder='回复该评论：'></textarea>"+
								"								<div class='huifu-btn-b'>"+
								"									<a href='javascrit:;' class='huifu-btn'>发送</a>"+
								"								</div>"+
								"							</div>"+
								"						</div>"+
								"						<!-- 回复 E -->"+
								"						"+
								"						<!-- 回复列表显示 S -->"+
								"						<div>"+
								"							<div class='huifulist-cnt'>"+
								"								<ul>"+
								"									<li class='c-huifulist' style='display:none;'>"+
								"										<img class='tiny-img' height='30' width='30' alt='' src='https://ss0.baidu.com/73F1bjeh1BF3odCf/it/u=3986019189,2125872432&fm=85&s=AA82C54E001435C896B45D3C03005040'>"+
								"										<span class='g-nickname'>啊浮夸浮夸撒</span>"+
								"										<div class='huifu-g-cnt'>哈哈就发货佛啊付好款撒娇好伐</div>"+
								"										<p class='huifu-g-date'>2016-03-56 02:21:23</p>"+
								"										<div style='clear: both;'></div>"+
								"									</li>"+
								"									<li class='c-huifulist' style='display:none;'>"+
								"										<img class='tiny-img' height='30' width='30' alt='' src='https://ss0.baidu.com/73F1bjeh1BF3odCf/it/u=3986019189,2125872432&fm=85&s=AA82C54E001435C896B45D3C03005040'>"+
								"										<span class='g-nickname'>啊浮夸浮夸撒</span>"+
								"										<div class='huifu-g-cnt'>哈哈就发货佛啊付好款撒娇好伐</div>"+
								"										<p class='huifu-g-date'>2016-03-56 02:21:23</p>"+
								"										<div style='clear: both;'></div>"+
								"									</li>"+
								"								</ul>"+
								"							</div>"+
								"						</div>"+
								"						<!-- 回复列表显示 E -->"+
								"					</div>"+
								"					<div style='clear: both;'></div>"+
								"				</li>");
					}
					
					
					
					
					
					
					
				}
				console.log(JSON.stringify(r[0]));
				vm.commentList=r;
				vm.commentCount=vm.commentList.length;
			});
		},
		saveComment: function (event) {
			/*评论*/
			var comment={
				wordCount:[],
				msgCnt : "",
				msgCntFn : function(e){
					if($.trim($(".my-comment textarea").val())==""){
						$(".my-comment textarea").css({
							border:"1px solid red"
						});
					}else{
						//do something..
						$(".comm-null-wrap").remove();
						$(".message-wrap").prepend(
							"<li style='list-style:none;background: rgba(255,255,255,.8);' class='u-message "+animate.animateStyle[Math.floor(Math.random()*animate.animateStyle.length)]+"'>"+
								"<div class='user-img'>"+
									"<img width='50' height='50' src='"+vm.currUser.userPic+"'>"+
								"</div>"+
								"<div class='comment-body'>"+
									"<p class='comm user-name' style='padding-top: 10px;'>"+vm.currUser.usernick+"" +
									"	<span class='time-qian'>刚刚</span>"+
									"	<span style='display:none;' class='comm-zan'>"+
										"	<a href='#' class='c-paizhuan c-comm'>拍一砖(0)</a>"+
										"	<a class='c-zan c-comm' href='#'>赞(0)</a>"+
										"	<a href='#' class='c-reply c-comm' @click='huifuComment(0)'>回复(0)</a>"+
									"	</span>"+
											"</p>"+
									"<p class='comment-content'>"+$(".my-comment textarea").val()+"</p>"+
									"<p class='comm comment-date' style='margin:0 20px 20px 0;color: #C5C5C5;'><span>"+new Date(Date.parse( new Date())).Format("yyyy-MM-dd hh:mm:ss")+"</span></p>"+
									"<div style='clear: both;'></div>"+
								"</div>"+
								"<div style='clear: both;'></div>"+
							"</li>"

							);
							$(".my-comment textarea").val("");
					}
				}
			}
			
			comment.msgCnt=$.trim($(".my-comment textarea").val());
			$(".word-limit #word-count").html("0");
			comment.msgCntFn();
			
			
			
			console.log("进入评论添加:"+vm.comment.commentContent);
			if(vm.comment.commentContent == undefined || $.trim(vm.comment.commentContent) == ''){
				layer.msg("请输入评论内容",{time:1000});
				return;
			}
			var url = "/WX-PLATFORM/comment/save";
			var comment=vm.comment;
			comment.gid=vm.goods.id;
			console.log("=============");
			console.log(comment);
			console.log("=============");
			$.get(url,comment,function(r){
				console.log(r);
				if(r.code == 0){
					layer.msg("评论成功",{time:1000});
				}
			});
		},
		getUser: function(){
			var url="/WX-PLATFORM/rest/user.find";
			console.log("==url---="+url);
			$.get(url,"",function(r){
				console.log(JSON.stringify(r));
				vm.currUser=r;
			});
		},
		del: function (event) {
			var ids = getSelectedRows();
			if(ids == null){
				return ;
			}
			
			confirm('确定要删除选中的记录？', function(){
				$.ajax({
					type: "POST",
				    url: "../base/supplier/delete",
				    data: JSON.stringify(ids),
				    success: function(r){
						if(r.code == 0){
							alert('操作成功', function(index){
								$("#jqGrid").trigger("reloadGrid");
							});
						}else{
							alert(r.msg);
						}
					}
				});
			});
		},
		getCurrGoodsInfo: function(){
			$.get("/WX-PLATFORM/goods/get/"+vm.goods.id, function(r){
				 console.log("-------------------"+JSON.stringify(r));
				vm.goodsName=r.goods.goodsName;
            });
		},
		queryZanOrZhuan:function(id,text,i){
			var url1="/WX-PLATFORM/comment/user.zanorzhuan.status.get";
			var data1={"cid":id};
			var cc=false;			//判断是否已拍过砖
			
			$.ajax({
				url:url1,
				data:data1,
				async: false,
				method:"GET",
				success:function(r){
					for(var v in r){
						if(r[v].status==i){
							cc=true;
							return;
						}
					}
				}
			});
			return cc;
		},
		//点赞
		dianZan:function(id,i){
			var text="已点过赞";
			if(vm.queryZanOrZhuan(id,text,'0')){
				layer.msg(text,{time:"1500"});return;
			};
			var zanObj=$(".commentList").find("li").eq(i).find(".c-zan");
			var url="/WX-PLATFORM/comment/dianzan";
			var data={"id":id};
			$.get(url,data,function(r){
				if(r){
					var obj=$(".commentList").find("li").eq(i).find(".c-zan .zan-count");
					console.log(obj.html());
					var count=+obj.html()+1;
					console.log("count1="+count);
					obj.html(count);
				}
			});
			
			var urlZan="/WX-PLATFORM/comment/zanorzhuan.save";
			var dataZan={"uid":vm.currUser.userid,"cid":id,"status":"0"};
			$.get(urlZan,dataZan,function(r){
				if(r){
					gn_obj_plus.plusOne(zanObj);//点赞+1特效
					$(".commentList").find("li").eq(i).find(".c-zan").css({"color":"red"});
				}
			});
		},
		//拍砖
		paiZhuan:function(id,i){
			var text="已拍过砖";
			if(vm.queryZanOrZhuan(id,text,'1')){
				layer.msg(text,{time:"1500"});return;
			};
			
			var zhuanObj=$(".commentList").find("li").eq(i).find(".c-paizhuan");
			var url="/WX-PLATFORM/comment/paizhuan";
			var data={"id":id};
			$.get(url,data,function(r){
				if(r){
					var obj=$(".commentList").find("li").eq(i).find(".c-paizhuan .paizhuan-count");
					console.log("obj.html="+obj.html());
					var count=(+obj.html())+1;
					console.log("count2="+count);
					obj.html(count);
				}
			});
			var urlZan="/WX-PLATFORM/comment/zanorzhuan.save";
			var dataZan={"uid":vm.currUser.userid,"cid":id,"status":"1"};
			$.get(urlZan,dataZan,function(r){
				if(r){
					gn_obj_plus.plusOne(zhuanObj);//点赞+1特效
					$(".commentList").find("li").eq(i).find(".c-paizhuan").css({"color":"red"});
				}
			});
		},
		huifuComment:function(i){
			var u=$(".commentList").find(".u-message").eq(i);
			var s=u.find(".comment-body .c-huifu").css("display");
			if(s=="none"){
				$(".commentList").find(".u-message").eq(i).find(".c-huifu").css({"display":"block"});
				$(".commentList").find(".u-message").eq(i).find(".shouqi").css({"display":"inline-block"});
			}else{
				$(".commentList").find(".u-message").eq(i).find(".c-huifu").css({"display":"none"});
				$(".commentList").find(".u-message").eq(i).find(".shouqi").css({"display":"none"});
			}
		},
		shouqi:function(i){
			var u=$(".commentList").find(".u-message").eq(i);
			u.find(".c-huifu").css({"display":"none"});
			u.find(".shouqi").css({"display":"none"});
		},
		huifulist:function(i){
			var u=$(".commentList").find(".u-message").eq(i);
			var s=u.find(".huifulist-cnt ul li").eq(i);
			var s=u.find(".c-huifulist").css("display");
			if(s=="none"){
				u.find(".c-huifulist").css({"display":"block"});
			}else{
				u.find(".c-huifulist").css({"display":"none"});
			}
			//$(".commentList").find("li").eq(i).find(".shouqi").css({"display":"none"});
		}
	}
});